<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-09-04 16:18:08
 * @LastEditTime: 2019-09-11 16:11:41
 * @LastEditors: Please set LastEditors
 -->
<template>
  <view class="slects">
        <view class="ler_one">温馨提示，请根据需要收集的作业，选择对应的学科</view>
        <view class="ler_two">
            <view v-for="(item,index) in datay" @click="gopic(index+1)" :key="index"><image :src="item.img"></image>{{item.course}}</view>
        </view>
        <image src="/static/images/83ed149514e2db0609d29ea82db0516.png" v-if="!grade"></image>

        <view class="cofing" @click="album(1)" v-if="statey">
                  <view class="boxs"> 
                        <view @click="album(2)">从相册中上传图片</view>
                        <view @click="picture()">拍照上传图片</view>
                  </view>
        </view>    
  </view>
</template>

<script>
const util = require('../../utils/util.js')
const apis = require('../../utils/api.js').default
export default {
  data(){
    return {
          datay:[],
          num:'',
          statey:false,  //选择框状态
          grade:''  
    }
  },
  onLoad(options){
      this.$set(this,'grade',options.grade)
      console.log(options.grade)
      if(options.grade){
            console.log(1)
            this.$set(this,'datay',[
                  {course:'语文',img:'/static/images/yu.png'},
                  {course:'数学',img:'/static/images/shu.png'},
                  {course:'英语',img:'/static/images/ying.png'},
                  {course:'化学',img:'/static/images/hua.png'},
                  {course:'物理',img:'/static/images/wf.png'}
            ])
      }else{
            console.log(2)
            this.$set(this,'datay',[
                  {course:'数学',img:'/static/images/01652bcef0d8a7651c856679efd75f8.png'}
            ])
      }
  },
  methods:{
    gopic:function(num){
      // true为练习。false为拍照
      if(this.grade){
            wx.navigateTo({
                url:`/pages/question/main?grader=${this.grade}&classIndex=${num}`
          })
      }else{
            this.num = num;
            this.statey = true;
      }
    },
    album:function(m){             //点击本地上传图片
         if(m == 1){
              this.statey = false;
          }else{
           let _this = this;
           this.statey = false;
           wx.chooseImage({  
                count: 1,  //最多可以选择的图片总数  
                sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有  
                sourceType: ['album'], // 可以指定来源是相册还是相机，默认二者都有  
                success: function (res) {  
                    if(res.tempFiles[0].size > 5000000){
                          console.log('图片不能大于5M')
                          wx.showToast({
                              title:'图片不能大于5M',
                               icon:'none' 
                          })
                      return
                    }
                    // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片  
                    // apis.upFiles(wx.getFileSystemManager().readFileSync(res.tempFilePaths[0], "base64"))
                    apis.upFiles({filePath:res.tempFilePaths[0],type:_this.num,callback:function(resy){
                          wx.setStorageSync('loslist',resy)
                          wx.navigateTo({
                              url:"../fructify/main"
                          })
                    }})
                }
            })
        }
    },
    picture:function(){      //从拍照上传
      // console.log(this.num)
     wx.navigateTo({
        url:"../picture/main?type="+this.num
      })
        this.statey = false;
    }
  }
}
</script>

<style lang="less" scoped>
.slects{
      width: 100%;
      height: 100%;
      position: relative;
}
.cofing{
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      background: rgba(0, 0, 0, .7);
      display: flex;
      justify-content: center;
      align-items: center;
}
.boxs{
      width: 65%;
      height: 250rpx;
      background: #fff;
      border-radius: 15rpx;
}
.boxs view{
      height: 125rpx;
      text-align: center;
      line-height: 125rpx;
}
.boxs view:nth-child(1){
      border-bottom: 1rpx solid #eee;
}
.slects .ler_one{
      font-size: 28rpx;
      color: #070707;
      margin:82rpx 0 46rpx 0;
      text-align: center;
}
.slects .ler_two{
      width: 80%;
      margin: 0 auto;
}
.slects .ler_two view{
      display: inline-block;
      text-align: center;
      font-size: 32rpx;
      color: #919191;
}
.slects .ler_two view:nth-child(3n-1){
      margin: 0 100rpx 75rpx 100rpx;
}
.slects .ler_two view image{
      width: 132rpx;
      height: 132rpx;
      display: block;
      margin-bottom: 48rpx;
}
.slects image{
      width:95%;
      height: 392rpx; 
      display: block;
      margin: 0 auto;
}

</style>

